/**
 * Created by chenzui on 2017/5/5.
 */
var UserInfoHead = React.createClass({
    render: function(){
        return(
            <header data-am-widget="header" className="am-header am-header-default am-header-fixed ">
                <div className="am-header-left am-header-nav">
                    <a onclick="history.go(-1)" className="">
                        <i className="icon_8"></i>
                    </a>
                </div>
                <h1 className="am-header-title">
                    个人信息
                </h1>
                <div className="am-header-right am-header-nav">
                    <a className="">
                        保存
                    </a>
                </div>

            </header>
        )
    }
});

var HeadImg = React.createClass({
    render: function(){
        return(
            <div className="box padding-top12-left10  border-bottom prelative" >

                <div className="box-1 am-padding-top-ss" >
                    <span className="prelative">头像</span>
                </div>
                <div className=" am-padding-right-ll">
                    <i className="my-pic"><img  src="../assets/images/icons/qq.png" className="am-circle width-35px"/></i>
                    <i className="icon-arrow-right"></i>
                </div>
            </div>
        )
    }
});

var AddressManage = React.createClass({
    handleAddressListClick: function(){
        location.href='addressList.html';
    },
    render: function(){
        return(
            <div className="box border-bottom am-padding-top-ss am-padding-right-sm am-padding-bottom-ss prelative" onClick={this.handleAddressListClick}>
                <div className="box-1 ">收货地址</div>
                <div className="am-padding-right-ll"><span >管理收货地址</span><i className="icon-arrow-right"></i></div>
            </div>
        )
    }
});


var BindPhone = React.createClass({
    render: function(){
        return(
            <div className=" font-color-35 am-margin-top-sm my-menu-lists font-14 bg-white ">

                <div className="box padding-top12-left10  border-bottom point-hand prelative" onclick="window.location.href='013.html'">

                    <div className="box-1    font-color-35 " >
                        <span className="prelative">绑定手机号</span>
                    </div>
                    <div className="am-padding-right-ll font-color-40">
                        130*****1234
                    </div>
                    <i class="icon-arrow-right"></i>
                </div>
            </div>
        )
    }
});

var ModifyPwd = React.createClass({
    render: function(){
        return(
            <div className="bg-white  font-14">


                <div className="box border-bottom am-padding-top-ss am-padding-bottom-ss prelative" onclick="window.location.href='014.html'">
                    <div className="box-1 am-padding-left-sm">修改密码</div>
                    <div className="am-padding-right-sm">
                        <div className="am-padding-right-ll"><i className="icon-arrow-right"></i></div>
                    </div>
                </div>
            </div>
        )
    }
});

var AboutUs = React.createClass({
    render: function(){
        return(
            <div className="bg-white am-margin-top-sm  font-14">
                <div className="box prelative border-bottom am-padding-top-ss am-padding-bottom-ss" onclick="window.location.href='015.html'">
                    <div className="box-1 am-padding-left-sm">关于我们</div>
                    <i className="icon-arrow-right"></i>
                </div>
            </div>
        )
    }
});

var Page = React.createClass({
    render: function() {
        return (
            <div>
                <UserInfoHead/>
                <section className="" data-tag="css-nav">
                    <div className=" font-color-35 my-menu-lists font-14 bg-white am-margin-top-sm">
                        <HeadImg/>
                        <AddressManage/>
                    </div>
                   <BindPhone/>
                   <ModifyPwd/>
                   <AboutUs/>
                </section>
            </div>
        )
    }

});

ReactDOM.render(
    <Page />,
    document.getElementById('root')
);